Jetpack Compose 与 Material You 常见问题解答
我们近期发布了一些关于 Material You 的文章:
在 Android 12 中构建更现代的应用 Widget 实战 | 在应用中使用 Compose Material 3 深度解析 Jetpack Compose 布局 使用 Jetpack Compose 实现精美动画 实践 | Jetpack Compose 中的状态管理 使用 Compose 构建 Wear OS 应用 借助 Material You 动态配色丰富您的应用
我们在社区中收集到了相关的问题,整理成本篇与 Material You 相关的常见问题和解答分享给大家。
问: 如何为较早 Android 版本上的应用进行设计?
答: 对于这个问题有两种常见的观点: 一个是将 Material You 的设计移植到旧平台,另一个则是让应用继续使用旧版本的 Material 主题。
在您做出选择之前一定要明确,在 Android 12 及以后版本的设备上,您需要迁移到 Material Design 3 主题才能够使用动态颜色。因此我们建议您创建自定义主题,这样一来当动态颜色不可用时,您的应用仍然能够用上理想的色彩搭配,您可以使用我们开发的 Material Theme Builder 工具来辅助主题自定义。
如需了解更多,请参阅:
动态颜色
https://m3.material.io/styles/color/dynamic-color/overview Material Theme Builder 工具
https://material-foundation.github.io/material-theme-builder/
如需了解更多,请参阅:
Compose 互操作 (Compose Interop)
https://developer.android.google.cn/jetpack/compose/interop/interop-apis Jetpack Compose
https://developer.android.google.cn/jetpack/compose/documentation
如需了解更多,请参阅:
动画 API
https://developer.android.google.cn/jetpack/compose/animation
如需了解更多,请参阅:
测试 Compose 布局
https://developer.android.google.cn/jetpack/compose/testing
答: 我们了解到很多开发者都依赖 MotionLayout,如果您也是其中一分子,相信您也很关心 Jetpack Compose 是否可以提供相似的功能,或者如何从 MotionLayout 迁移到 Compose。事实上我们几乎是同时开发 MotionLayout 和 Compose 的,并且两者仍然在并行发展中。
对比两者,Compose 提供了几乎 "开箱即用" 的动画支持。随着开发者们的呼声越来越大,我们向 Compose 中添加了 ConstraintLayout。再看 MotionLayout,我们没有试图用 Compose 填补什么巨大的功能缺口,因为 MotionLayout 同样提供了强大的动画支持。ConstraintLayout 和 MotionLayout 都弥补了视图系统中的某些限制,但这些限制其实在 Compose 中并不存在。
MotionLayout
https://developer.android.google.cn/training/constraint-layout/motionlayoutConstraintLayout
https://developer.android.google.cn/reference/androidx/constraintlayout/widget/ConstraintLayout
答: 一些企业开发者会关注自己的品牌颜色是否会被 Material You 的动态颜色特性所覆盖。Material 3 的设计理念是希望根据用户自己的壁纸进行个性化配置,但我们也希望尊重那些具有强烈品牌颜色或是想要保护颜色的开发者。所以您可以放心,您的品牌色不会被 Material You 覆盖,在开发中有这样几种情况: 如果您使用了 Material 3 库中的 Material Theming,您可以主动选择使用动态配色。如果您的用户使用了 Android 12,而我们的配色方案中恰好有可以与您的品牌色映射的色槽,您可以显式声明使用它们,这种显式声明是不会被 Material You 所覆盖的。所以我们鼓励您在 Android 12 中使用动态配色,您对于挑选具体的色彩方案具有绝对的选择权。
正如我们对前面一个问题的解答,在大多数情况下,您需要提供备选配色方案,因为动态颜色只有 Android 12 及以后版本的设备才能使用。或许将您的品牌配色作为备选色是一个不错的方案。这里要再次向您推荐 Material Theme Builder 工具,因为 Material 3 库中的 ColorScheme 类会对 Material 3 的配色方案建模。这个类提供了约 26 个参数来模拟所有的颜色槽,如此可观的数量给了设计很大的灵活性。您可能会觉得一开始要将品牌颜色映射到这些颜色槽里面会令人不知所措,或是被巨大的工作量困扰,那么您可以将主要品牌色输入 Material Theme Builder 工具,由它对色彩进行混合、协调、搭配,这样就得到了看起来很 Material You 却又很符合您的品牌色的色彩组合。您甚至可以找到这个工具的一款 Figma 插件,设计师可以从设计端进行颜色配制,然后给您提供准确的 Compose 和 Android XML 代码,从而减少您的工作量。ColorScheme 类额外的颜色槽还可以支持您配置一个相当复杂、灵活的企业品牌色方案。
如需了解更多,请参阅:
Material Theming
https://material.io/design/material-theming/overview.html#material-theming Material Theme Builder 工具 https://material-foundation.github.io/material-theme-builder/
如需了解更多,请参阅:
色彩系统
https://m3.material.io/styles/color/the-color-system/key-colors-tones
如需了解更多,请参阅:
Jetpack Compose 历史版本
https://developer.android.google.cn/jetpack/androidx/releases/composeLazyColumn
https://developer.android.google.cn/jetpack/compose/lists
焦点 API 的文档
https://developer.android.google.cn/reference/kotlin/androidx/compose/ui/focus/package-summary
Material Theme Adapter
https://material-components.github.io/material-components-android-compose-theme-adapter/
问: 用户直接在 Compose 中引用 XML 颜色定义是否正确?
答: 我们认为,只要在视图系统和 Compose 中都使用了某种颜色,您就有必要在 XML 中保留对应的数据源。直接使用 Compose 的 API 去引用它们就好。还是那个观点,只要您使用了视图系统,就建议您这样做。
样式和主题背景
https://developer.android.google.cn/guide/topics/ui/look-and-feel/themes
Material Theme Builder 工具
https://material-foundation.github.io/material-theme-builder/Material Design 3 中的动态颜色
https://m3.material.io/styles/color/dynamic-color/overview
如需了解更多,请参阅:
完整组件列表
https://m3.material.io
推荐阅读